<template>
	<div>
		<span>{{$t('i18n.tips')}}</span>
		<el-button type="primary" @click="$i18n.locale = $i18n.locale === 'zh'?'en':'zh';">{{$t('i18n.btn')}}</el-button>
		<div class="list">
		<h2>{{$t('i18n.title1')}}</h2>
			<p>{{$t('i18n.p1')}}</p>
			<p>{{$t('i18n.p2')}}</p>
			<p>{{$t('i18n.p3')}}</p>
		</div>
		<h2><slot>{{$t('i18n.title2')}}</slot></h2>
		<div>
				<i18n path="i18n.info" tag="p">
					<a slot="action" href="https://element.eleme.cn/2.0/#/zh-CN/component/i18n">{{ $t('i18n.value') }}</a>
				</i18n>
		</div>
	</div>
</template>

<script>
export default {
    data(){
        return {
        }
    }
}
</script>

<style lang="stylus" scoped>
	.list{
	    padding: 30px 0;
	}
	.list p{
	    margin-bottom: 20px;
	}
	a{
	    color: #409eff;
	}
</style>
